// 导入 Vue 构造函数
import Vue from 'vue'
// 导入 Vuex 构造函数
import Vuex from 'vuex'
// 导入全局 getters
import getters from './getters'
// 导入三个子模块
import app from './modules/app'
import settings from './modules/settings'
import user from './modules/user'

import route from './modules/route'
// 导入让vuex 数据持久化的插件
import createPersisitedState from 'vuex-persistedstate'

import tagsView from './modules/tagsView'

Vue.use(Vuex)

const store = new Vuex.Store({
  // 注册三个子模块(采用对象简写语法)
  modules: {
    app,
    settings,
    user,
    route,
    tagsView
  },
  getters,
  // token 为什么同时用 vuex 和本地存储公共管理
  plugins: [
    // 使用 vuex 数据持久化的插件，传入配置
    createPersisitedState({
      // 本地存储键名 -> locaStorage.setItem('hrsass-23',vuex下的state数据)
      key: 'hrasaa',
      // 那些模块下的数据需要持久化
      // 1.自动把vuex中的数据同步到localStorage一份
      // 2.当我们刷新页面时，自动的把localStorage的数据赋值给vuex中的数据
      // 3.每当vuex中的数据发生变化了，也会走动地把最新的vuex数据同步到localStorage
      //  数据的使用方式
      //   1.代码中，我们都是从vuex中做数据的增删改查(只用vuex中的数据)
      //   2.localStorage只负责书信数据不丢失的任务
      paths: ['app', 'settings']
    })
  ]
})

export default store
